/**
 * 〈所属模块〉通用
 * 〈功能描述〉H5页面
 *
 * @author wuuyunan
 * @date 2017/9/20
 */

import React, { Component } from "react";
import { StyleSheet, WebView } from "react-native";
import { connect } from "react-redux"; // 引入connect函数

import { Color, scale } from "../common";
import BasePage from "../widget/common/BasePage";
import * as helpCenterAction from "../actions/helpCenterAction"; // 导入action方法
import EnumConstants from "../common/EnumConstants";
import NavigatorUtil from "../utils/NavigatorUtil";

const { H5Type } = EnumConstants;

let h5Type;

class HelpCenter extends Component {
  componentWillMount() {
    const { props } = this;
    h5Type = NavigatorUtil.getPageParam(props, "type");
    props.dispatch(h5Type === H5Type.HELPCENTER ? helpCenterAction.getContent() : helpCenterAction.getAbousContent());
  }

  render() {
    const { helpCenterReducer } = this.props;
    const { content, initing, abousContent } = helpCenterReducer;
    const html = h5Type === H5Type.HELPCENTER ? content : abousContent;
    console.log(html);
    return (
      <BasePage style={styles.container} showIniting={initing}>
        <WebView originWhitelist={["*"]} source={{ html }} style={styles.container} />
      </BasePage>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: Color.white,
    paddingHorizontal: 16 * scale,
  },
});

const reducers = state => {
  return {
    helpCenterReducer: state.helpCenterReducer,
  };
};

export default connect(reducers)(HelpCenter);
